<template>
  <div>
    <div class="card-header" >
      <Input v-model="shopName" placeholder="请输入店铺名称..." style="width: 200px;display: inline-block"/>
      <Button type="primary" icon="ios-search" @click="loadData">搜索</Button>
    </div>
    <div class="card-body card-padding" >
      <Table :loading="loading" :columns="columns" :data="data"></Table>
    </div>
    <div class="card-footer  card-padding">
      <div class="page pull-right">
        <Page :current.sync="page" :total="totalElements" show-elevator show-sizer  show-total @on-page-size-change="changePageSize"></Page>
      </div>
    </div>
  </div>
</template>

<script>
import {findAll} from '../../api/shop/shopApi'
export default {
  data () {
    return {
      shopName: undefined,
      loading: false,
      columns: [
        {
          title: '序号',
          type: 'index'
        },
        {
          title: '会员名称',
          key: 'sellerName'
        },
        {
          title: '店鋪名称',
          key: 'shopName'
        },
        {
          title: '店铺地址',
          key: 'address'
        },
        {
          title: '经营类别',
          key: 'category'
        },
        {
          title: '保证金',
          key: 'depositAmount'
        },
        {
          title: '开店时间',
          key: 'createDate'
        }
      ],
      data: [
        {
          address: '国省市区镇路',
          category: '1,2,3',
          createDate: '2018-03-13 10:11:11',
          depositAmount: 1000,
          sellerId: '111',
          sellerName: 'zhangsan',
          shopId: '1',
          shopName: 'XX手机店',
          subStockType: 'PAID'
        }
      ],
      page: 1,
      totalElements: 0,
      pageSize: 10
    }
  },
  mounted () {
    this.search()
  },
  methods: {
    search () {
      this.page = 1
      this.loadData()
    },
    loadData () {
      this.loading = true
      let params = {
        name: this.shopName,
        page: this.page - 1,
        size: this.pageSize
      }
      findAll(params, data => {
        this.loading = false
        this.data = data.content
        this.totalElements = data.totalElements
      })
    },
    changePageSize (pageSize) {
      this.pageSize = pageSize
      this.loadData()
    }
  },
  watch: {
    page () {
      this.loadData()
    }
  }
}
</script>

<style lang="less" scoped>

</style>
